<template>
  <el-dialog :model-value="props.show" title="设置排序" @close="$emit('hide')">
    <div class="box">
      <div>排序：</div>
      <div class="box1">
        <el-input class="input" size="large" v-model="allocSort" />
      </div>
    </div>
    <template #footer>
      <el-button @click="$emit('hide')">取消</el-button>
      <el-button type="primary" @click="submit">确定</el-button>
    </template>
  </el-dialog>
</template>
<script setup lang="ts">
import { ElMessage, ElMessageBox } from "element-plus";
import { inject, reactive, ref } from "vue";
import { SubjectUpdateApi, recommendSubjectApi } from "../api/index";

const emit = defineEmits(["hide", "fn"]);

const props = defineProps({
  show: {
    type: Boolean,
    default: false,
  },
  id: {
    type: Number,
    default: 0,
  },
  sort: {
    type: Number,
    default: 0,
  },
});

const allocSort = inject("allocSort");

const sortChild = ref(0);

// const list = ref<number[]>([]);

const roles = ref<number>(0);

const sortApiFn = () => {
  sortChild.value = props.sort;
  //   console.log(sortChild.value);

  // 发请求
  SubjectUpdateApi(props.id, roles.value).then((res) => {
    if (res.code === 200) {
      // 提示 + 关闭
      emit("hide");

      ElMessage.success("修改成功");
    }
  });
};
const MyParams = reactive<SearchList>({
  pageNum: 1,
  pageSize: 5,
  productName: "",
  recommendStatus: 1,
});
const submit = () => {
  roles.value = props.sort;
  //   console.log(roles.value);
  ElMessageBox.confirm("确定要修改当前用户的角色吗?", "修改用户角色", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      SubjectUpdateApi(props.id, roles.value);
      recommendSubjectApi(MyParams.pageNum,MyParams.pageSize);
      emit("hide");
    })
    .catch(() => {});
};
</script>
<style lang="less" scoped>
.box {
  display: flex;
  justify-content: right;
  .box1 {
    width: 200px;
    margin-right: 50px;
  }
}
</style>
